<script setup>
/*
vue2组件数据双向绑定
   v-model
       <son :value="appValue" @input='appValue=$event' />
       <son v-model="appValue" />
       son.vue
         props:['value']
         this.$emit('input',实参值)
   .sync
       <son :xxx='appXxx'  @update:xxx="appXxx=$event" /> 
       <son :xxx.sync='appXxx'   /> 
       son.vue
         props:['xxx']
         this.$emit('update:xxx',实参值)
  vue3的v-model
     v-model
        <son  :modelValue='appValue' @update:modelValue="appValue=$event" />
        <son  v-model:modelValue='appValue'  v-model:xxxx='appXxxx' />
        只有属性名是modelValue时可省略
        <son  v-model='appValue'  />
      const props =  defineProps({
            modelValue:{
               type:Number
            }
        })
       const emits=defineEmits(['update:modelValue'])
       emits('update:modelValue',实参值)

        





*/
import { ref } from 'vue'
import XxxSon3 from './components/XxxSon3.vue'
const appValue = ref(999)
</script>

<template>
  <div class="app-page">父组件</div>
  <hr />
  <XxxSon3 :modelValue="appValue" @update:modelValue="appValue = $event"></XxxSon3>
  <XxxSon3 v-model:modelValue="appValue"></XxxSon3>
  <XxxSon3 v-model="appValue"></XxxSon3>
</template>

<style scoped></style>
